Vue.component('footbox', {
    data: function () {
        return {
            count: 0
        }
    },
    props: ['active'],
    template: `
      <div class="footbox">
			<div class="footer">
				<ul>
					<li v-bind:class="active == 'shouye'?'on':''">
						<a href="/">
                            <img v-if="active=='shouye'" src="img/footer/icon_home_pre.png" />
                            <img v-else src="img/footer/icon_home.png" />
							<p>首页</p>
						</a>
					</li>
					<li v-bind:class="active == 'fenlei'?'on':''">
						<a href="/fenlei.html">
                            <img v-if="active=='fenlei'" src="img/footer/icon_sort_pre.png" />
                            <img v-else src="img/footer/icon_sort.png" />
							<p>分类</p>
						</a>
					</li>
					<li v-bind:class="active == 'xuexi'?'on':''">
						<a href="/xuexi.html">
                            <img v-if="active=='xuexi'" src="img/footer/icon_study_pre.png" />
                            <img v-else src="img/footer/icon_study.png" />
							<p>学习</p>
						</a>
					</li>
					<li v-bind:class="active == 'wode'?'on':''">
						<a href="/wode.html">
                            <img v-if="active=='wode'" src="img/footer/icon_my_pre.png" />
                            <img v-else src="img/footer/icon_my.png" />
							<p>我的</p>
						</a>
					</li>
				</ul>
			</div>
		</div>
      `
})
